<template>
    <PetsHeader v-if="isHeader"/>
    <RouterView/>
    <PetsTabbar v-if="isTabbar"/>
</template>

<script setup name="App">
import { computed, ref } from 'vue';
import { RouterView, useRoute, useRouter } from 'vue-router';
import PetsHeader from './components/PetsHeader.vue';
import PetsTabbar from './components/PetsTabbar.vue';
const route = useRoute()
const isHeader = computed(()=>{
    return route.name !== "addPet"
        && route.name !== "productDetail"
        && route.name !== "topicDetail"
        && route.name !== "login"
        && route.name !== "register"
        && route.name !== "petShop"
        && route.name !== "checkOrder"
        && route.name !== "addPet"
        && route.name !== "menu"
        && route.name !== "seeking"
        && route.name !== "address"
        && route.name !== "addressDetail"
        && route.name !== "updateAddress"
        && route.name !== "seekDetail"
        && route.name !== "seekPublish"
})

const isTabbar = computed(()=>{
    return route.name !== "addPet"
        && route.name !== "productDetail"
        && route.name !== "topicDetail"
        && route.name !== "login"
        && route.name !== "register"
        && route.name !== "checkOrder"
         && route.name !== "menu"
         && route.name !== "seeking"
          && route.name !== "address"
        && route.name !== "addressDetail"
        && route.name !== "updateAddress"
        && route.name !== "seekDetail"
        && route.name !== "seekPublish"

})

</script>

<style scoped>
</style>
